// Set variables
$(document).ready(function () {

	// 重写按键限制
	document.onkeydown = undefined; // 注意这里的document

	document.querySelector('html').addEventListener('keydown', function keydown(e) {
		e.stopImmediatePropagation();
	})

	//document.querySelector('#view')();// width:1604px; transform:translated(-308px,0px,0px)

	chrome.extension.sendMessage({ name: "getIP" }, function (response) {

		chrome.extension.sendMessage({ name: "getOptions" }, function (response) {

			// 重写按键限制
			document.onkeydown = undefined; // 注意这里的document

			var websiteIP_status = response.EnableRenderImg;
			if (websiteIP_status == "Disable" || typeof websiteIP_status == 'undefined') {


				$("body").append('<div id="rendFloatDom" class="NYwishes" style="z-index:99999">'
					+ '<div id="expandInputBtn" class="send"><div class="send-btn" style="float:right"><a onclick="document.getElementById(\'expandInputBtn\').style.display=\'none\';document.getElementById(\'showRenderImgDiv\').style.display=\'block\';">展开</a></div></div>'
					+ '<div class="send" id="showRenderImgDiv" style="display:none">'
					+ '<div class="send-btn" ><a id="RenderImgBtn">渲染</a></div></div></div>'
					+ '');

				function doRender() {
					//var chooseVal = document.getElementById('choose-id').value;
					var node = document.getElementById('view');
					// if (chooseVal.startsWith('cid:')) { // 根据classId获取标签
					// 	chooseVal = chooseVal.substring(4);
					// 	var splitIndex = chooseVal.indexOf('#');
					// 	var index = 0;
					// 	if (splitIndex > 0) {
					// 		index = chooseVal.substring(splitIndex + 1);
					// 		chooseVal = chooseVal.substring(0, splitIndex);
					// 	}
					// 	node = document.getElementsByClassName(chooseVal)[parseInt(index)];
					// } else {
					// 	if (chooseVal.startsWith("id:")) {
					// 		chooseVal = chooseVal.substring(3);
					// 	}

					// 	if ("" == chooseVal) {
					// 		return;
					// 	}

					// 	node = document.getElementById(chooseVal);
					// }

					if (node == null || typeof (node) == undefined) {
						alert("没有选中的dom结构");
						return;
					}
					// domtoimage.toBlob(node)
					// 	.then(function (blob) {
					// 		//window.saveAs(blob, 'my-node.png');

					// 		// 创建隐藏的可下载链接
					// 		var eleLink = document.createElement('a');
					// 		eleLink.download = 'filename.png';
					// 		eleLink.style.display = 'none';
					// 		// 字符内容转变成blob地址
					// 		eleLink.href = URL.createObjectURL(blob);
					// 		// 触发点击
					// 		document.body.appendChild(eleLink);
					// 		eleLink.click();
					// 		// 然后移除
					// 		document.body.removeChild(eleLink);
					// 	});

					domtoimage.toPng(node)
						.then(function (dataUrl) {

							let image = new Image();
							// 解决跨域 Canvas 污染问题
							image.setAttribute("crossOrigin", "anonymous");
							image.onload = function () {
								let canvas = document.createElement("canvas");
								canvas.width = 1306 / 2;//image.width / 4;//1604;// image.width;// 1350;
								canvas.height = image.height;
								let context = canvas.getContext("2d");
								//-(image.width / 4)
								context.drawImage(image, -(1306 / 2), 0, image.width, image.height); //image.width, image.height); , image.width, image.height

								let img_right = canvas.toDataURL("image/png"); //得到图片的base64编码数据

								// 将文件在一个 window 窗口中打开，并隐藏这个窗口。

								var win = window.open("", "_blank");
								win.document.write('<html><head><title>渲染图</title></head><body><div style=\'text-align:center\'><img src="' + img_right + '" /></div></body></html>');
								// var win = window.open().document.write('<html><head><title>渲染图</title></head><body><div style=\'text-align:center\'><img src="' + img_right + '" /></div></body></html>');
								//var win = window.open().document.write('<html><head><title>渲染图</title></head><body><div style=\'text-align:center\'><img src="' + img_right + '" /></div></body></html>');
								// // 在 win 窗口中按下 ctrl+s 保存窗口内容
								//win.document.execCommand("SaveAs", true, "1.png");
								// // 使用完了，关闭窗口
								//win.close();


								// var ifr = document.createElement('iframe');
								// ifr.style.display = 'none';
								// ifr.src = img_right;
								// document.body.appendChild(ifr);
								// // 保存页面 -> 保存文件
								// ifr.contentWindow.postMessage("message");
								// ifr.addEventListener("message", function (event) {
								// 	ifr.contentWindow.document.execCommand('SaveAs', false, "1.png");
								// });

								//ifr.contentWindow.document.execCommand('SaveAs', false, "1.png");
								//document.body.removeChild(ifr);

								context.clearRect(0, 0, canvas.width, canvas.height);
								context.drawImage(image, 0, 0, image.width, image.height); //image.width, image.height); , image.width, image.height

								let img_left = canvas.toDataURL("image/png"); //得到图片的base64编码数据
								var win = window.open().document.write('<html><head><title>渲染图</title></head><body><div style=\'text-align:center\'><img src="' + img_left + '" /></div></body></html>');
								// win.document.execCommand("SaveAs", true, "1.png");
								// var ifr2 = document.createElement('iframe');
								// ifr2.style.display = 'none';
								// ifr2.src = img_left;
								// document.body.appendChild(ifr2);
								// // 保存页面 -> 保存文件
								// ifr2.contentWindow.document.execCommand('SaveAs', false, "2.png");
								// document.body.removeChild(ifr2);
							};
							image.src = dataUrl;

							// var url = dataUrl;
							// window.open().document.write('<html><head><title>渲染图</title></head><body><div style=\'text-align:center\'><a download="out.png" href="' + url + '"><img src="' + url + '" /></a></div></body></html>');
						})
						.catch(function (error) { });
				}

				$("#choose-id").keydown(function (e) {
					if (e.keyCode == 13) {
						doRender();
					}
				});

				$('#RenderImgBtn').click(function () {
					doRender();
				});
			}
		});
	});
});
